{% extends "squad/user_settings/base.jinja2" %}

{% block page_title %}{{ _('User profile') }}{% endblock %}

{% block settings %}
<h1>{{ _('Profile') }}</h1>

<div class='row'>
    <div class='col-md-8'>
        <form action="{{url('settings-profile')}}" method="POST">
            {{ csrf_input }}
            <div class="form-group">
                <label for="{{form.first_name.id_for_label}}">{{form.first_name.label}}</label>
                {{form.first_name|add_class("form-control")}}
            </div>
            <div class="form-group">
                <label for="{{form.last_name.id_for_label}}">{{form.last_name.label}}</label>
                {{form.last_name|add_class("form-control")}}
            </div>
            <div class="form-group">
                <label for="{{form.email.id_for_label}}">{{form.email.label}}</label>
                {{form.email|add_class("form-control")}}
            </div>
            <input class='btn btn-default' type="submit" value="{{ _('Save') }}" />
        </form>
    </div>
    <div class='col-md-4'>
        <div class="form-group">
            <label>{{ _('Profile picture') }}</label>
            <div>
                <img src="{{avatar_url(form['email'].value(), 200)}}" class='avatar-lg' alt="{{ _('Your avatar') }}"/>
            </div>
        </div>
            <p>
            {{ _('This avatar is derived from your email address, and is provided by <a href="https://www.gravatar.com/">Gravatar</a>.') | safe }}
            </p>
        </div>
    </div>
</div>

{% endblock %}
